<template>
    <div>
      <div class="base_form" style="padding-top: 15px;margin: auto;min-height: 100vh;">
        <div class="base_query_oneLine">
          <div class="query_right">我的评价</div>
          <div class="query_left">
            <el-button class="orangeButton" size="small" @click="getMission()">我的评价任务</el-button>
          </div>
        </div>

        <div class="table-content">
          <el-table :data="myAssessmentList" border style="width: 100%">
            <el-table-column prop="num" label="学号" width="180"> </el-table-column>
            <el-table-column prop="name" label="姓名" width="180"> </el-table-column>
            <el-table-column prop="assessment" label="评语"> </el-table-column>
            <el-table-column prop="morality" label="品行">
              <template #default="props">
                <el-rate
                    v-model=props.row.morality
                    disabled
                    :colors="colors"
                >
                </el-rate>
              </template>
            </el-table-column>
            <el-table-column prop="talent" label="才华">
              <template #default="props">
                <el-rate
                    v-model=props.row.talent
                    disabled
                    :colors="colors"
                >
                </el-rate>
              </template></el-table-column>
            <el-table-column prop="whole" label="总体评价">
              <template #default="props">
                <el-rate
                    v-model=props.row.whole
                    disabled
                    :colors="colors"
                >
                </el-rate>
              </template></el-table-column>
          </el-table>
        </div>
      </div>
    </div>
  </template>
  
  <script>
  import {getMyAssessment} from "~/services/teachingServ";
  import router from "~/router";
  export default {
    data() {
      return {
        colors: ['#99A9BF', '#F7BA2A', '#FF9900'],
        numName:'',
        myAssessmentList: [],
      };
    },
  
    computed:{
      showUserName(){
        return this.$store.state.username
      }
    },
  
    created() {
        this.initialize();
    },
  
    methods: {
        async initialize() {
            this.myAssessmentList = (await getMyAssessment()).data;
        },
  
      getMission() {
        router.push('/student-assessment-panel')
      },
    },
  };
  </script>